<template>
	<view class="scroll-top-box bg-white" v-if="showToTop" @tap="goTopFun">
		<image class="img" mode="widthFix" src="/static/img/vertical-align-top.png" />
		<view class="to-top-txt">顶部</view>
	</view>
</template>

<script>
export default {
	name: 'scrollTop',
	props: {
		showToTop: {
			type: Boolean,
			default: false
		}
	},
	data() {
		return {};
	},
	methods: {
		goTopFun() {
			this.$emit('goTopFun', 0);
		}
	}
};
</script>

<style lang="scss">
.scroll-top-box {
	position: fixed;
	right: 32rpx;
	bottom: 524rpx;
	text-align: center;
	height: 64rpx;
	width: 64rpx;
	border: 2rpx solid #cdcccc;
	// transform: scale(0.5);
	border-radius: 50%;
	z-index: 100;
	.img {
		height: 40rpx;
		width: 40rpx;
		margin: 0 12rpx;
	}
	.to-top-txt {
		font-family: PingFangSC-Regular;
		font-size: 16rpx;
		color: #7f7f7f;
		letter-spacing: 0.48rpx;
		text-align: center;
		font-weight: 400;
		margin-top: -12rpx;
	}
}
</style>
